<!-- DOCUMENT LIST-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/files">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">dvr</i>
                <span class="home--card__text">DocumentList - Content Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
    Demonstrates multiple Alfresco Content Services components used together to display the files of your Content Services instance:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with the Rest Api and core services</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">dvr</i>
        <span class="home--feature-list__text">Document List</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-documentlist" target="_blank">ng2-alfresco-documentlist</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">file_upload</i>
        <span class="home--feature-list__text">Upload</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-upload" target="_blank">ng2-alfresco-upload</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">view_module</i>
        <span class="home--feature-list__text">DataTable</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-datatable" target="_blank">ng2-alfresco-datatable</a>
      </li>
    </ul>
  </div>
</div>


<!-- Process Services-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/activiti">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">apps</i>
                <span class="home--card__text">Process Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
    Demonstrates multiple Alfresco Process Services components used together to show your Process Services process and tasks:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with the Rest Api and core services</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">view_module</i>
        <span class="home--feature-list__text">App List</span>
        <a href="https://www.npmjs.com/package/ng2-activiti-tasklist" target="_blank">ng2-activiti-apps</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">view_headline</i>
        <span class="home--feature-list__text">Task List</span>
        <a href="https://www.npmjs.com/package/ng2-activiti-tasklist" target="_blank">ng2-activiti-tasklist</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">view_headline</i>
        <span class="home--feature-list__text">Process List</span>
        <a href="https://www.npmjs.com/package/ng2-activiti-processlist" target="_blank">ng2-activiti-processlist</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">view_quilt</i>
        <span class="home--feature-list__text">Form</span>
        <a href="https://www.npmjs.com/package/ng2-activiti-form" target="_blank">ng2-activiti-form</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">pie_chart</i>
        <span class="home--feature-list__text">Analytics</span>
        <a href="https://www.npmjs.com/package/ng2-activiti-analytics" target="_blank">ng2-activiti-analytics</a>,
        <a href="https://www.npmjs.com/package/ng2-activiti-diagrams" target="_blank">ng2-activiti-diagrams</a>
      </li>
      <li>
        <i class="material-icons home--feature-list__icon">view_module</i>
        <span class="home--feature-list__text">DataTable</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-datatable" target="_blank">ng2-alfresco-datatable</a>
      </li>
    </ul>
  </div>
</div>


<!-- DATATABLE-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/datatable">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">view_module</i>
                <span class="home--card__text">DataTable - Content Services & Process Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
    Basic table component:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with the Rest Api and core services</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
    </ul>
  </div>
</div>

<!-- UPLOADER-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/uploader">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">file_upload</i>
                <span class="home--card__text">Uploader - Content Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
    Basic table uploader component for the Content Services & Process Services:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with the Rest Api and core services</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
    </ul>
  </div>
</div>

<!-- LOGIN-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/login">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">account_circle</i>
                <span class="home--card__text">Login - Content Services & Process Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
        Login component for the Content Services and Process Services:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with the Rest Api and core services</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
    </ul>
  </div>
</div>

<!-- WEBSCRIPT-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/webscript">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">extension</i>
            <span class="home--card__text">Webscript - Content Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
    Displays and creates webscripts in your Content Services instance:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with the Rest Api and core services</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
    </ul>
  </div>
</div>

<!-- TAG-->
<div class="demo-card-square mdl-card mdl-shadow--2dp home-cards">
  <div class="mdl-card__title mdl-card--expand" routerLink="/tag">
    <h2 class="mdl-card__title-text">
      <i class="material-icons home--card__icon">local_offer</i>
                <span class="home--card__text">Tag - Content Services</span>
    </h2>
  </div>
  <div class="mdl-card__supporting-text">
    Displays and adds tags to the node of your Content Services instance:
    <ul class="home--feature-list">
      <li>
        <i class="material-icons home--feature-list__icon">brightness_1</i>
        <span class="home--feature-list__text">Communication with Rest</span>
        <a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
      </li>
    </ul>
  </div>
</div>
